<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <title>公告</title>
    <!-- 引入Mui -->
    <link rel="stylesheet" href="css/mui.min.css">
    <!-- 引入公共样式 -->
    <link rel="stylesheet" href="css/public.css">
    <style>
        #notice .timee{
           text-align: right;
        }

        #notice .mui-collapse-content h5{
            font-size: 1.1rem;
            color: #333;
        }
    </style>
</head>
<body>
    <!-- 头部 -->
    <header id="header" class="mui-bar mui-bar-nav">
         <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
        <h1 class="mui-title">公告</h1>
    </header>
    <!-- 头部 结束 -->
    <div class="mui-content">
        <ul class="mui-table-view" id="notice">
            <li class="mui-table-view-cell mui-collapse">
                <a class="mui-navigate-right">
                    公告1公告1
                </a>
                <div class="mui-collapse-content">
                    <h5>公告</h5>
                    <p>公告内容公告内容公告内容公告内容公告内容公告内容公告内容公告内容公告内容公告内容公告内容</p>
                    <p class="timee">2018-11-11 12:12:12</p>
                </div>
            </li>
        </ul>
    </div>
    <script src="js/jquery.min.js"></script>
    <script src="js/mui.min.js"></script>
    <script src="js/doT.js"></script>
    <!-- 以上为引入第三方插件 -->
</body>
</html>